@import '../../../../../business/style/main.less';
@import '../../../../../business/style/styles/component.less';
@import '../../../../../business/style/styles/mainForm.less';
@import '../../../../../business/style/styles/report.less';

@centerMargin: -50%;
@pictureScaleNum: 1.05;
@pictureScaleTime: 5s;
@picturePaddingTop: 60%;
@projectWidth: 25%;
@projectMarginBottom: 1.25%;
@conditionScaleTime: .5s;
@projectListScaleTime: 2s;


.charitable-appropriation-modal {
    .okBtn {
        display: none;
    }

    .ctrl-btns {
        margin-top: var(--reportTitleBorderImageLineHeight);
    }

    .ant-table-wrapper {
        margin-top: var(--reportTitleBorderImageLineHeight);
    }

}

.charitable-appropriation-list {
    margin: var(--blankMainFormForNhAllViewPadding);
    padding: var(--blankMainFormForNhAllViewPadding);
    background: var(--deepBackgroundTextColor);
    border-radius: var(--amTagBorderRadius);
    display: flex;
    flex-wrap: wrap;

    .service-project-buyctn {
        display: flex;
        justify-content: center;
        flex: var(--noMargins) var(--layout) var(--headerLeftWidth);
        margin: var(--headerRrightNoneMarginTop);
    }

    h4 {
        display: flex;
        align-items: center;
        padding-right: var(--ntFormCreatorMarginLeft);
        height: var(--detailMain);
        line-height: var(--detailMain);
    }

    .header-list {
        border: var(--headMainFormHeadBorderBottom);
        margin-bottom: var(--reportTitleBorderImageLineHeight);
        display: flex;
        flex-direction: wrap;

        .header-subtitle {
            padding: var(--echartsForReactMarginBottom);
            background: var(--auxiliaryTextColor);
            display: inline-block;
            height: var(--detailMain);
            display: flex;
            align-items: center;
            color: var(--amTagColor);
        }

        .header-condition {
            padding: var(--echartsForReactMarginBottom);
            cursor: pointer;
            display: inline-block;
            height: var(--detailMain);
            display: flex;
            align-items: center;

            &:hover {
                transition: @conditionScaleTime;
                background: var(--themeColor2);
                color: var(--amTagColor);
            }
        }

        .active {
            background: var(--themeColor2);
            color: var(--amTagColor);
        }
    }


    .list-content {
        margin-top: var(--unmRowMarginBottom);
        margin-bottom: var(--unmRowMarginBottom);
        display: flex;
        flex-wrap: wrap;
        flex-direction: row;
        margin-left: var(--noMargins);
        margin-right: var(--noMargins);
        width: var(--completelyFill);

        &:before {
            display: none;
        }

        &:after {
            // content: "";
            // flex: auto;
            display: none;
        }

        .empty-data {
            width: var(--completelyFill);

            .ant-row-flex {
                margin-top: var(--amTagBorderRadius);
                font-size: var(--screenCompanyFontSize);
            }
        }

        .projectlist {
            cursor: pointer;
            margin-bottom: @projectMarginBottom;
            // box-shadow: 0 0 var(--textButton) var(--dividingLine);
            width: @projectWidth  !important;

            .project-section {
                border: 1px solid #f5f5f5;

                .detail {
                    padding: var(--amTagBorderRadius);

                    .projectinfo,
                    .projectinfotitle {
                        margin: var(--resColPadding);
                    }

                    .intention {
                        white-space: nowrap;
                        overflow: hidden;
                        text-overflow: ellipsis;
                    }
                }
            }

            .project-section.selected {
                border: 1px solid rgb(24, 144, 255);
                color: rgb(24, 144, 255);
            }

            .button-ctrl {
                margin-top: var(--amTagBorderRadius);
            }

            &:hover {
                .project-section {
                    box-shadow: 0 0 var(--textButton) var(--dividingLine);

                    .picture img {
                        transform: scale(@pictureScaleNum) translate3d(@centerMargin, @centerMargin, 0);
                        ;
                    }

                }
            }
        }

    }

    .submit-row {
        width: var(--completelyFill);
        margin-bottom: var(--reportTitleBorderImageLineHeight);
    }

    .ant-pagination {
        width: var(--rowContentTableWidth);
        text-align: center;
    }
}